@import (reference) "~weaver-mobile/dist/weaver-mobile.less";
@import (reference) "./index.less";

@detail: cowork-detail;

.cowork-detail-flex {
  height: 100%;
  display: flex;
  flex-direction: column;
  .cr-back-top-title {
    bottom: 12%;
    z-index: 1;
  }
}
.cowork-communication {
  height: 100%;
  position: relative;
  .am-icon-filter-o-hot {
    color: @brand-primary !important;
  }
  &-content {
    position: absolute;
    top: @search-bar-height + 1 + 31;
    bottom: 0;
    width: 100%;
    &.checked {
      top: @search-bar-height + 45 + 31;
    }
  }
  &-buttonGroup {
    position: absolute;
    bottom: -@modal-button-height;
    width: 100%;
  }
  &-centerPage {
    height: 100%;
    position: relative;
    .am-icon-filter-o-hot {
      color: @brand-primary !important;
    }
    &-content {
      position: absolute;
      top: @search-bar-height + 1 + 31;
      bottom: 0;
      width: 100%;
      &.checked {
        top: @search-bar-height + 45 + 31;
        bottom: @button-height;
      }
    }
    &-buttonGroup {
      position: absolute;
      bottom: 0;
      width: 100%;
    }
  }

  /* 协作交流 */
  &-coworkList {
    padding-left: 16 * @hd;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    &-line {
      display: flex;
      justify-content: space-between;
      &-avatar {
        margin-right: 8 * @hd;
      }
      &-info {
        overflow: hidden;
        .am-tag {
          color: @color-text-base-inverse;
          margin-right: 5 * @hd;
          max-width: 100%;
          .am-tag-text {
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
          }
        }
      }
      &-name {
        display: block;
        color: @color-text-paragraph;
        word-break: break-all;
        .cowork-top {
          font-weight: 500;
          display: inline-block;
          margin-left: 6 * @hd;
        }
      }
      &-pending {
        color: @brand-important;
        margin-left: -6 * @hd;
      }
      &-lastTime {
        display: block;
        color: @color-text-caption;
      }
      &-star {
        margin: 10 * @hd 0 0 8 * @hd;
        .am-icon-blog-xing {
          color: #f6a623;
        }
        .am-icon-collection {
          color: #b2b2b2;
        }
      }
    }
    &-mark {
      background: @brand-primary;
      color: @color-text-base-inverse;
      font-size: @font-size-heading;
      width: 111 * @hd;
    }
  }
  &-noMore {
    text-align: center;
    color: @color-text-caption;
    padding: 15 * @hd;
  }
  // 批量标记
  .wm-route-layout-buttons {
    position: relative;
    bottom: 0;
    z-index: 100;
    .am-button {
      height: 50 * @hd;
    }
  }

  /* 协作详情 */
  &-detail {
    height: 100%;
    position: relative;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    &-indentation {
      height: calc(~"100% - " @tabs-height + 1);
    }
    .am-whitespace {
      background: @fill-body;
    }
    .am-list-view-scrollview {
      height: 100%;
    }
    &-atSome {
      width: 100%;
      height: 100%;
    }
    &-touchBox {
      > .wm-reply {
        position: fixed;
      }
      .am-icon-filter-o-hot {
        color: @brand-primary !important;
      }
    }

    &-touchBox-fixTop {
      padding-top: @tabs-height + 1;
      .cowork-fixTop {
        width: 100%;
        position: fixed;
        top: 0;
        z-index: 10;
        .am-flexbox {
          // background: @color-text-base-inverse;
          width: 100%;
          position: fixed;
          top: 0;
          z-index: 10;
        }
      }
    }

    /* 协作被删除页面 */
    .cowork-detele {
      height: 100%;
      background: @fill-base;
      position: relative;
      .am-result {
        padding-top: 0;
        padding-bottom: 0;
        border: none;
        position: absolute;
        top: 50%;
        margin-top: -81 * @hd;
        .am-icon-no-data {
          color: @color-text-placeholder;
          width: 60 * @hd;
          height: 60 * @hd;
        }
      }
    }

    /* 详情头部信息 */
    &-accordion {
      border-top: 0;
      .am-accordion-header {
        height: 100% !important;
        line-height: 100% !important;
        padding-left: 16 * @hd;
        padding-top: 10 * @hd;
        padding-bottom: 6 * @hd;
        .arrow {
          position: absolute;
          bottom: 0;
          top: 76% !important;
        }
        .detail-header {
          &-title {
            margin-bottom: 4 * @hd;
            display: flex;
            justify-content: space-between;
            &-name {
              font-size: @font-size-base;
              line-height: 20 * @hd;
              color: @brand-primary;
              letter-spacing: -0.39 * @hd;
              white-space: pre-wrap;
              word-break: break-all;
              .cowork-over {
                margin-left: 3 * @hd;
                display: inline-block;
              }
            }
            &-icon {
              position: relative;
              right: -15 * @hd;
            }
            &-popover {
              display: inline-block;
              margin-left: 7 * @hd;
            }
          }
          &-tags {
            width: 100%;
            white-space: pre-wrap;
            .am-tag {
              // font-size: @font-size-icontext;
              color: @color-text-base-inverse;
              max-width: 100%;
              .am-tag-text {
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
              }
            }
            .am-tag:not(:last-child) {
              margin-right: 8 * @hd;
            }
          }
          &-info,
          &-time {
            font-size: @font-size-icontext;
            line-height: 14 * @hd;
            margin: 7 * @hd 0;
            color: @color-text-placeholder;
            white-space: pre-wrap;
          }
          &-princ {
            display: inline-block;
            // margin-right: 10 * @hd;
          }
          &-start {
            display: block;
          }
        }
      }
      .am-accordion-content {
        .am-accordion-content-box {
          font-size: @font-size-caption-sm !important;
          padding: 0 6 * @hd 0 15 * @hd;
        }
      }
      &-contentBox {
        width: 100%;
        overflow: hidden;
      }
      &-content {
        width: 100%;
        overflow-x: scroll;
        overflow-y: inherit;
        -webkit-overflow-scrolling: touch;
        img {
          max-width: 100%;
        }
      }
      &-attach {
        .cowork-detail-content-list {
          padding-bottom: @h-spacing-md;
          &-icon {
            position: relative;
            top: 1 * @hd;
            display: inline-block;
            width: 24 * @hd;
            vertical-align: top;
            color: @color-text-caption;
          }
          .am-icon-md {
            width: 12 * @hd;
            height: 12 * @hd;
          }
          &-name {
            display: inline-block;
            @diff: 24 * @hd;
            width: calc(~"100% - @{diff}");
            color: @brand-primary;
            word-break: break-all;
          }
        }
      }
    }
    /* 详情头部信息 */
    &-header {
      &-summary {
        margin: 5 * @hd 12 * @hd;
        font-size: @font-size-caption-sm !important;
        color: @color-text-paragraph;
        line-height: @line-height-paragraph;
        word-break: break-all;
        overflow: hidden;
        text-overflow: ellipsis;
        -ms-text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
      }
    }

    /* ************************ 相关交流 && 与我相关 ******************************/
    &-comment {
      height: 100%;
      .wm-comment-scrollview-content {
        position: relative !important;
      }
      .wm-comment-nodata {
        // 暂无数据页面暂定高度
        height: 300 * @hd;
      }
      .wm-comment-list {
        // 根据页面修改comment组件内部样式
        .am-list-view-scrollview {
          overflow: inherit !important;
          .am-list-body {
            border-top: 0;
          }
          .am-list-footer {
            display: none;
          }
        }
        .wm-comment-nodata {
          height: 100 * @hd;
          .am-result {
            position: relative;
            margin-top: 100 * @hd;
          }
        }
      }
      .wm-reply-wrap {
        position: fixed;
        z-index: 100;
      }
    }
    &-renderRight {
      color: @color-text-caption;
      &-collect {
        position: relative;
        top: 4 * @hd;
        margin-left: 15 * @hd;
      }
      &-floor {
        margin-left: 15 * @hd;
      }
    }
    &-renderTopContent {
      color: @brand-important;
      font-weight: 700;
    }
    &-nomore {
      text-align: center;
      color: @color-text-caption;
      padding-top: 19.5 * @hd;
      font-size: @font-size-caption-sm;
      &-line-left {
        display: inline-block;
        width: 20 * @hd;
        height: 1 * @hd;
        vertical-align: middle;
        background: linear-gradient(to left, @color-icon-base, @fill-base);
      }
      &-line-name {
        padding: 0 10 * @hd;
        display: inline-block;
        vertical-align: middle;
      }
      &-line-right {
        display: inline-block;
        width: 20 * @hd;
        height: 1 * @hd;
        vertical-align: middle;
        background: linear-gradient(to right, @color-icon-base, @fill-base);
      }
    }
    &-nextPage {
      text-align: center;
      color: @color-text-caption;
      font-size: @font-size-caption-sm;
      > span {
        display: inline-block;
        margin-right: 7 * @hd;
      }
      .am-icon {
        position: relative;
        top: 6 * @hd;
      }
    }

    /********************* 参与情况 && 相关资源 ********************/
    &-parterList,
    &-resourceList {
      height: 100%;
      &-accordion {
        border-top: 0;
        .am-accordion-header {
          height: 100% !important;
          line-height: 100% !important;
          padding: 7 * @hd;
          color: @color-text-placeholder !important;
          background: @fill-body !important;
          .arrow {
            top: 31% !important;
          }
        }
        .am-accordion-content {
          padding: 0 15 * @hd;
          &-box {
            border-bottom: 0 !important;
          }
        }
      }
    }

    /* 参与情况 */
    &-parterList {
      // overflow-y: auto;
      // -webkit-overflow-scrolling: touch;
      &-accordion {
        .am-accordion-content {
          padding: 0;
        }
      }
      &-list {
        .am-list-item .am-list-line-multiple {
          padding-top: 8 * @hd;
          padding-bottom: 8 * @hd;
        }
        &-line {
          .shareName {
            display: block;
            color: @color-text-paragraph;
            padding-bottom: 5 * @hd;
          }
          .contentName {
            color: @color-text-caption;
            line-height: 17 * @hd;
            .name:not(:last-child):after {
              content: ", ";
            }
          }
          .principal {
            overflow: hidden;
            text-overflow: ellipsis;
            word-break: break-all;
            -ms-text-overflow: ellipsis;
            display: -webkit-box;
            -webkit-line-clamp: 3;
            -webkit-box-orient: vertical;
          }
        }
      }
    }

    /* 相关资源 */
    &-resourceList {
      overflow-y: auto;
      -webkit-overflow-scrolling: touch;
      &-line {
        color: @color-text-paragraph;
        box-sizing: border-box;
        padding: 11 * @hd;
        padding-left: 0;
        border-bottom: 1 * @hd solid @border-color-base;
      }
    }
  }

  /* 新建协作 */
  &-create {
    height: 100%;
    &-box {
      height: 100%;
      width: 100%;
      position: absolute;
      top: 0;
      bottom: 0;
    }
    /* 基本信息 */
    &-basicInfo {
      height: 100%;
      &-lastTime {
        padding-left: 22 * @hd;
        color: @color-text-paragraph;
        .am-list-line {
          padding-right: 7 * @hd;
          .am-list-content {
            color: @color-text-paragraph;
          }
        }
      }
      .wm-form {
        position: absolute;
        top: 0;
        bottom: @button-height;
        // display: flex;
        // flex-direction: column;
        width: 100%;
      }
      .am-button {
        position: absolute;
        bottom: 0;
        width: 100%;
      }
      .typeId-tip {
        background-color: @fill-body;
        color: @color-text-placeholder;
        padding: 2 * @hd 22 * @hd;
      }
    }
    /* 详细说明 */
    &-details {
      height: 100%;
      &-container {
        position: absolute;
        top: 0;
        bottom: @button-height;
        display: flex;
        flex-direction: column;
        width: 100%;
        img.mobileBlogImgInnerTemp {
          max-width: 100%;
        }
        &-editor {
          position: relative;
          flex: 1 1;
          .cke_chrome {
            position: absolute;
            top: 0;
            bottom: 0;
            width: 100%;
            border: none;
            .cke_contents {
              height: 100% !important; //改内连
              overflow: hidden;
            }
            .cke_inner {
              height: 100%;
            }
            .cke_top {
              display: none;
            }
            .cke_bottom {
              display: none;
            }
            .wm-reply {
              width: 100%;
              .wm-reply-bar {
                background: @fill-grey-weak;
                .wm-browser {
                  background: @fill-grey-weak;
                }
              }
            }
          }
        }
      }
      .am-button {
        position: absolute;
        bottom: 0;
        width: 100%;
      }
    }
  }

  /* 已退出人员 */
  &-quited {
    height: 100%;
    position: relative;
    &-choose {
      &-person {
        padding-left: 15 * @hd;
      }
    }
    &-list {
      position: absolute;
      width: 100%;
      top: 44 * @hd;
      bottom: @button-height;
    }
    &-btn {
      position: absolute;
      bottom: 0;
      width: 100%;
    }
  }

  /* 添加共享 */
  &-parterList {
    height: 100%;
    .am-list-body {
      height: 100%;
    }
    &-add {
      .am-list-line {
        .am-list-content {
          color: @brand-primary;
          text-align: center;
          .am-icon {
            margin-right: 8 * @hd;
            position: relative;
            top: 2 * @hd;
          }
        }
      }
    }
    .wm-list-page-item:last-child .am-list-line {
      border-bottom: 0;
    }
    &-content {
      position: absolute;
      width: 100%;
      top: @list-item-height;
      bottom: 0;
      overflow-y: scroll;
      -webkit-overflow-scrolling: touch;
      &.notadd {
        top: 0;
      }
      &.cowork-communication-parterList-createpage {
        bottom: @button-height;
      }
    }
    &-goback {
      position: absolute;
      width: 100%;
      bottom: 0;
    }
  }

  /* 标记为 */
  &-tag {
    height: 100%;
    display: flex;
    flex-direction: column;
    &-chooseMark-box {
      height: 100%;
      position: relative;
    }
    &-chooseMark {
      margin-top: 9 * @hd;
      position: absolute;
      width: 100%;
      top: 0;
      bottom: @button-height;
      .am-list {
        height: 100%;
        .am-list-body {
          height: 100%;
          display: flex;
          flex-wrap: wrap;
          position: relative;
          > .am-list-item {
            width: 100%;
            position: absolute;
            .am-list-line {
              border-bottom: 0 !important;
              .am-list-extra {
                padding-right: 15 * @hd;
                .am-icon-setting-up {
                  width: 22 * @hd;
                }
              }
            }
          }
        }
      }
      &-content {
        width: 100%;
        // display: flex;
        // flex-wrap: wrap;
        position: absolute;
        top: @list-item-height;
        bottom: 0;
        overflow-x: hidden;
        overflow-y: scroll;
        -webkit-overflow-scrolling: touch;
        .am-list-item {
          width: 45%;
          height: @list-item-height;
          float: left;
          .am-list-line {
            border-bottom: 0 !important;
            .am-tag {
              color: @color-text-base-inverse;
              margin-right: 5 * @hd;
              max-width: 100%;
              .am-tag-text {
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
              }
            }
          }
        }
        &-cancelChoose {
          width: 100% !important;
        }
      }
      &-lable {
        width: 100%;
        overflow-x: hidden;
        text-overflow: ellipsis;
        color: @color-text-base-inverse;
        text-align: center;
        box-sizing: border-box;
        padding: 5 * @hd 10 * @hd;
        border-radius: 12 * @hd !important;
      }
      &-nolable {
        width: 100%;
        overflow-x: hidden;
        text-overflow: ellipsis;
      }
    }
    .am-button-primary {
      width: 100%;
      position: fixed;
      bottom: 0;
    }
    .am-list-extra .am-icon-check-circle {
      color: @brand-primary;
    }
  }

  /* 标签管理 */
  &-manage {
    height: 100%;
    .am-list {
      position: absolute;
      top: 0;
      bottom: 0;
      width: 100%;
      .am-list-body {
        height: 100%;
        .cowork-communication-manage-content {
          height: calc(~"100% - " @list-item-height);
          overflow-y: scroll;
          -webkit-overflow-scrolling: touch;
        }
      }
    }
    .am-button {
      position: absolute;
      width: 100%;
      bottom: 0;
    }
    &-createTag {
      .am-list-line .am-list-content {
        text-align: center;
        color: @brand-primary;
        .am-icon {
          margin-right: 6 * @hd;
          position: relative;
          top: 2 * @hd;
        }
      }
    }
    &-tagLine {
      .am-list-content {
        display: flex;
        justify-content: space-between;
        .am-tag {
          color: @color-text-base-inverse;
          max-width: 100%;
          .am-tag-text {
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
          }
        }
      }
      &-lable {
        margin-right: 5 * @hd;
        overflow: hidden;
      }
      &-ops {
        color: @color-text-caption;
        > span {
          vertical-align: sub;
          .am-icon {
            margin-right: 6 * @hd;
            position: relative;
            top: 2 * @hd;
          }
        }
      }
      &-editor {
        margin-right: 18 * @hd;
      }
    }
  }

  /* 新建标签 */
  &-createTag {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }
}

.@{detail} {
  // 参与情况-人员详情页
  &-participation {
    height: 100%;
    .am-tabs-default-bar-tab,
    .am-tabs-expand-bar-tab {
      height: 64 * @hd;
      line-height: normal;
    }
    &-tab {
      display: inline-block;
      text-align: center;
      &-num {
        font-size: 17 * @hd;
      }
    }
    &-list-line {
      display: flex;
      &-avatar {
        flex-shrink: 0;
        padding-right: 8 * @hd;
      }
      &-userinfo {
        .departmentinfo {
          color: @color-text-caption;
          > span:first-child {
            padding-right: 8 * @hd;
          }
        }
      }
    }
  }

  // 默认参与人
  &-defalutjoiner {
    height: 100%;
  }

  &-coverage {
    height: 100%;
    .am-tabs {
      height: auto;
    }
    &-container {
      width: 100%;
      position: absolute;
      top: @tabs-height + 1;
      bottom: 0;
    }
  }
}
